import { _decorator, color, easing, instantiate, Node, Prefab, RichText, Sprite, tween, Tween, UITransform, v3 } from "cc";
import { BaseView } from "../../base/BaseView";
import { EventId } from "../EventMgr";
const { ccclass, property } = _decorator;

/**
 * 提示界面
 */
@ccclass("TipView")
export class TipView extends BaseView {

    @property(Node)
    /** 顶部飘字位置节点 */
    topFloatTextNode: Node
    @property(Prefab)
    /** 顶部飘字预制体 */
    topFloatTextPrefab: Prefab;

    /** 顶部飘字对象池 */
    topFloatTextPool: IFloatText[] = [];
    /** 顶部飘字队列 */
    topFloatTextQueue: string[] = [];
    /** 顶部飘字的下次可飘时间 */
    nextTopFloatTextTime = 0;

    protected onOpen(): void {
        this.on(EventId.floatText, this.onFloatText);
    }

    protected offListeners(): void {

    }

    protected onClose(): void {

    }

    getTopFloatText() {
        let floatText = this.topFloatTextPool.pop();
        if (!floatText) {
            let node = instantiate(this.topFloatTextPrefab),
                posNode = node.getChildByName("Pos"),
                sprite = posNode.getComponent(Sprite),
                bgNode = posNode.getChildByName("Bg"),
                txtNode = posNode.getChildByName("Text"),
                bgTrans = bgNode.getComponent(UITransform),
                txt = txtNode.getComponent(RichText),
                txtTrans = txtNode.getComponent(UITransform);

            floatText = {
                node,
                posNode,
                sprite,
                bgTrans,
                txt,
                txtTrans,
                tween1: tween(sprite)
                    .to(0.25, { color: color(255, 255, 255, 255) }, { easing: "quadOut" })
                    .delay(1.25)
                    .to(0.5, { color: color(255, 255, 255, 0) }, { easing: "quadOut" }),
                tween2: tween(posNode)
                    .to(1.5, { position: v3(0, 100) }, { easing: "circOut" })
                    .to(0.5, { position: v3(0, 125) }, { easing: "quadOut" })
                    .call(() => this.recyTopFloatText(floatText))
            };
        }
        return floatText;
    }

    recyTopFloatText(floatText: IFloatText) {
        if (!floatText) return;
        floatText.node.removeFromParent();
        this.topFloatTextPool.push(floatText);
    }

    nextTopFloatText() {
        if (!this.topFloatTextQueue.length) return;
        let now = Date.now();
        if (now > this.nextTopFloatTextTime) {
            this.nextTopFloatTextTime = now + 200;
            let str = this.topFloatTextQueue.shift();
            let floatText = this.getTopFloatText();
            this.topFloatTextNode.addChild(floatText.node);
            floatText.txt.string = str;
            floatText.bgTrans.width = floatText.txtTrans.width + 80;
            floatText.node.setPosition(0, -floatText.txtTrans.height * 0.5);
            floatText.posNode.setPosition(0, 0);
            floatText.sprite.color.set(255, 255, 255, 0);
            floatText.tween1.start();
            floatText.tween2.start();

            let children = this.topFloatTextNode.children;
            let len = children.length;
            for (let i = len; --i >= 0;) {
                let child = children[i];
                Tween.stopAllByTarget(child);
                tween(child)
                    .to(0.2, { position: v3(0, (len - i) * floatText.txtTrans.height * 0.5) }, { easing: "quadOut" })
                    .start();
            }
        }
        this.timerOnce(this.nextTopFloatText, (this.nextTopFloatTextTime - now) / 1000);
    }

    onFloatText(data: EventData[EventId.floatText]) {
        this.topFloatTextQueue.push(data);
        this.nextTopFloatText();
    }

}

interface IFloatText {
    node: Node,
    posNode: Node,
    sprite: Sprite,
    bgTrans: UITransform,
    txt: RichText,
    txtTrans: UITransform,
    tween1: Tween<Sprite>,
    tween2: Tween<Node>
};